import { Routes, RouterModule } from '@angular/router';
import { NgModule } from '@angular/core';

import { ProductDetailComponent } from './product-detail/product-detail.component';
import { ProductListComponent } from './product-list/product-list.component';
import { GroupsComponent } from './groups/groups.component';
import { GroupsDetailComponent } from './groups-detail/groups-detail.component';

const routes: Routes = [

  {
    path: '',
    redirectTo: 'product-list',
    pathMatch: 'full'
  },

    {
      path: 'product-list',
      component: ProductListComponent,
      data: {
        title: 'product list',
        breadcrumb: "product list"
      }
    },

    {
        path: 'product-detail/:asin',
        // path: 'product-detail/:id',
        // path: 'product-detail',
        component: ProductDetailComponent,
        data: {
            title: 'product detail',
            breadcrumb: "product detail"
        }
    },
    {
        path: 'groups',
        component: GroupsComponent,
        data: {
            title: 'groups',
            breadcrumb: 'groups'
        }
    },
  {
    path: 'group-detail',
    component: GroupsDetailComponent,
    data: {
      title: 'group detail',
      breadcrumb: 'group detail'
    }
  }
];

@NgModule({
    imports: [RouterModule.forChild(routes)],
    exports: [RouterModule]
})
export class ProductRoutingModule {}
